<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>props传递数据</title>
    </head>
    <body>




         <div id = "app">
<!--            <my-component warning-text = "提示信息" ></my-component>-->
            <my-component warning-text = "提示信息" warning-info = "提示信息1"></my-component>
        </div>
        <script src = "../../vue.min.js"></script>
        <script>
            Vue.component('my-component',{
                // props:['warningText'],
                // mark 必须使用驼峰转换
                props:['warningText','warningInfo'],
                // props:['warningText','warning-info'],
                // template:'<div>{{ warningText }} </div>'
                //eferenceError: warning is not defined
                // template:'<div>{{ warningText }} {{warning-info}}</div>'
                template:'<div>{{ warningText }} {{warningInfo}}</div>'
            });
            var app = new Vue({
                el:'#app'
            })
        </script>

    </body>
</html>